<template>
  <div class="biao_shu_item" style="height: 90px">
    <header class="flex-row">
      <span class="title flex-grow-limit flex-row flex-vertical-center flex-between">
        <span class="text-limit">{{ data.exchange_address }}</span>
        <img src="@img/btn/more.png" class="moreBtn" v-if="visibleMoreBtn" width="24px"
        @click.capture="$emit('clickMore', $event, data.id)">
      </span>
    </header>
    <!-- <main>{{ user.nick_name }}</main> -->
    <footer class="flex-row flex-between" style="position: relative;bottom: 5px">
      <span class="type">{{ data.shift_type_str }}</span>
      <span class="color-subtext">{{ data.created_at | date }}</span>
    </footer>
  </div>
</template>

<script>
export default {
  props: ['data', 'visibleMoreBtn'],

  data (){
    return {

    }
  },

  computed: {
    user (){
      return this.data.user
    }
  },

  methods: {

  }
}
</script>

<style lang="less" scoped>
.biao_shu_item{
  height: 80px;
  box-sizing: border-box;
  padding: 15px;
  background-color: white;
  border-radius: 10px;
  margin-top: 5px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  position: relative;
  bottom: 5px;
}

header{
  .title{
    font-size: 18px;
  }
}

.date{
  width: 6em;
  font-size: 14px;
  color: @subtext;
}

main{
  color: @subtext;
  margin-top: 10px;
  font-size: 14px;
}

footer{
  margin-top: 10px;
}

.type{
  color: @danger;
  font-size: 18px;
}
</style>
